import React from 'react';   
import {connect} from 'dva';
import {Link, browserHistory} from 'dva/router';
import {Table, Row, Col, Form, Input, Icon, InputNumber, Radio, DatePicker, Select, Upload, Button, Switch, Modal, Popconfirm, Tabs, message} from 'antd';
const R = require('ramda');
import moment from 'moment'
const dateFormat = 'YYYY-MM-DD';
const { RangePicker } = DatePicker;

import BizParams from '../../../components/commons/BizParams'
import CustomerApproval from '../../../components/supplier/components/CustomerApproval';
import RightBox from "../../../components/commons/RightBox";
import RIGHT from "../../../utils/RightConstants";


const FormItem = Form.Item;
const Option = Select.Option;
const RadioGroup = Radio.Group;

export default connect(({customerApproval}) => ({customerApproval}))(
    Form.create()(class customerApproval extends React.Component {
        constructor(props) {
            super(props);
            this.state = {
                type:"2"
            }
        }

        componentDidMount() {
            this.props.dispatch({
                type: 'customerApproval/queryCustomerManageList',
            });
        }


        handleResetFields = () => {
            if(this.editCustomer)this.editCustomer.handleResetFields();
        }

        handleCancel = (flag) => {
            if(flag){
                this.handleResetFields();
            }
        }

        onEdit = (record, isDisable) => {
            this.handleOpen(record, isDisable, {});
        }

        handleOpen = (record, isDisable) => {

            this.props.dispatch({type: 'customerApproval/getCustomerById', payload: {id: record.id, isApproval: true}});
            this.customerApproval.handleOpen(isDisable,this.state.type);
        }

        handleSearch = (e, flag) => {
            let values = this.props.form.getFieldsValue();
            let newPage = this.props.customerApproval.page;
            newPage.page = flag ? newPage.page : 1;
            let time=values.time;
            this.props.dispatch({
                type: 'customerApproval/queryCustomerManageList',
                payload: {
                    customerNO: values.customerNO,
                    cstName: values.cstName,
                    cstType: values.cstType,
                    cstManage: values.cstManage,
                    cstWaiter: values.cstWaiter,
                    status: values.status,
                    beginTime:R.isNil(time)||R.isEmpty(time)?null:time[0].format(dateFormat),
                    endTime:R.isNil(time)||R.isEmpty(time)?null:time[1].format(dateFormat),
                    page: newPage,
                }
            });
            this.setState({type:values.status});


        };



        columns = [
            {title: '客户编码', dataIndex: 'customerno', key: 'customerno', width: '150px', fixed: true},

            // {title: '代理协议号', dataIndex: 'companyna', key: 'companyna', render(record) {
            //     return ("xx");
            // }},

            {title: '客户名称', dataIndex: 'companyname', key: 'companyname',},

            {title: '客户类型', render(record) {
                if(R.isNil(record.companytypeName) || R.isEmpty(record.companytypeName)){
                    return "未知";
                }else{
                    return record.companytypeName;
                }
            }},

            {title: '采购经理', render(record) {
                if(R.isNil(record.managerName) || R.isEmpty(record.managerName)){
                    return "未分配";
                }else{
                    return record.managerName;
                }
            }},

            {title: '跟单经理', render(record) {
                if(R.isNil(record.waiterName) || R.isEmpty(record.waiterName)){
                    return "未分配";
                }else{
                    return record.waiterName;
                }
            }},

            {title: '创建时间', dataIndex: 'createtime', key: 'createtime'},

            {title: '操作', width: '200px', fixed: 'right', key: 'key_oprator',

            render: (text, record, index) => {

                return (
                    <span>
                        {record.status === "2" ? <RightBox resource={RIGHT.APPROVAL.APPROVAL_SUPPILER}><a href="#" onClick={this.onEdit.bind(this, record, false)}>审核</a></RightBox> : <a href="#" onClick={this.onEdit.bind(this, record, true)}>查看</a>}
                        {/*<span className="ant-divider"/>*/}
                    </span>
                );
            }
        }
        ];

        render () {
            let dataSouce = R.isNil(this.props.customerApproval.dataSource) ? {} : this.props.customerApproval.dataSource;
            let formItemLayout = {labelCol: {span: 6}, wrapperCol: {span: 18}};
            const { getFieldDecorator } = this.props.form;
            let values = this.props.form.getFieldsValue();
            let time=values.time;
            let pagination = {
                showTotal: total => `共 ${total} 条数据`,
                pageSize: this.props.customerApproval.page.size,
                total: this.props.customerApproval.page.totalRow,
                showSizeChanger: true,
                current:this.props.customerApproval.page.page,
                onShowSizeChange: (current, size) => {
                    let newPage = this.props.customerApproval.page;
                    newPage.size = size;
                    newPage.page = 1;
                    this.props.dispatch({
                        type: 'customerApproval/queryCustomerManageList',
                        payload: {
                            customerNO: values.customerNO,
                            cstName: values.cstName,
                            cstType: values.cstType,
                            cstManage: values.cstManage,
                            cstWaiter: values.cstWaiter,
                            status: values.status,
                            beginTime:R.isNil(time)||R.isEmpty(time)?null:time[0].format(dateFormat),
                            endTime:R.isNil(time)||R.isEmpty(time)?null:time[1].format(dateFormat),
                            page: newPage,
                        }
                    });
                },
                onChange: (pageNumber, pageSize) => {
                    let newPage = this.props.customerApproval.page;
                    newPage.page = pageNumber;
                    this.props.dispatch({
                        type: 'customerApproval/queryCustomerManageList',
                        payload: {
                            customerNO: values.customerNO,
                            cstName: values.cstName,
                            cstType: values.cstType,
                            cstManage: values.cstManage,
                            cstWaiter: values.cstWaiter,
                            status: values.status,
                            beginTime:R.isNil(time)||R.isEmpty(time)?null:time[0].format(dateFormat),
                            endTime:R.isNil(time)||R.isEmpty(time)?null:time[1].format(dateFormat),
                            page: newPage,
                        }
                    });
                }
            }

            return (
                <div>

                <Row>
                    <Col span={7}><FormItem {...formItemLayout} label={'客户代码'}>{getFieldDecorator('customerNO')(<Input/>)}</FormItem></Col>
                    <Col span={7}><FormItem {...formItemLayout} label={'客户名称'}>{getFieldDecorator('cstName')(<Input/>)}</FormItem></Col>
                </Row>
                <Row>
                    <Col span={7}><FormItem {...formItemLayout} label={'采购经理'}>{getFieldDecorator('cstManage')(<Input/>)}</FormItem></Col>
                    <Col span={7}><FormItem {...formItemLayout} label={'跟单经理'}>{getFieldDecorator('cstWaiter')(<Input/>)}</FormItem></Col>
                </Row>
                <Row>
                    <Col span={7}><FormItem {...formItemLayout} label={'客户类型'}>
                        {getFieldDecorator('cstType')(
                            <BizParams sprCode={"cstType"} style={{width:'100%'}} all={true}/>
                        )}
                    </FormItem></Col>
                    <Col span={7}>
                        <FormItem {...formItemLayout} label={'创建时间'}>
                            {getFieldDecorator('time')(
                                <RangePicker
                                    style={{width: 265}}
                                    showTime={{ format: 'YYYY-MM-DD' }}
                                    format="YYYY-MM-DD"
                                    placeholder={['开始时间', '结束时间']}
                                />
                            )}
                        </FormItem>
                    </Col>

                </Row>
                <Row>
                    <Col span={7}>
                    <FormItem {...formItemLayout} label={'状态'}>
                    {getFieldDecorator('status', {
                                        initialValue: "2"
                                    })(
                            <RadioGroup style={{width: 800}}>
                                <Radio value="2">待审核</Radio>
                                <Radio value="3">待补充资料</Radio>
                                <Radio value="4">审核通过</Radio>
                                <Radio value="5">审核不通过</Radio>
                            </RadioGroup>
                        )}
                        </FormItem>
                    </Col>
                    <Col span={7} style={{float: 'right'}}>
                        <Button type="primary" icon="search" style={{marginRight: 5}} onClick={this.handleSearch.bind(this)}>查询</Button>
                    </Col>
                </Row>
                <Table dataSource={this.props.customerApproval.list} columns={this.columns} bordered={true} size={'middle'}  pagination={pagination}/>
                <CustomerApproval wrappedComponentRef={(inst) => this.customerApproval = inst}
                                  dispatch={this.props.dispatch}
                                  dataSource={this.props.customerApproval.dataSource}
                                  attachments ={this.props.customerApproval.attachments}
                                  approvaList ={this.props.customerApproval.approvaList}
                                  handleSearch = {() => this.handleSearch(null, true)}
                />
            </div>
            )
        }
    })


)
